import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)

const routes = [
  {
    path: '/nav',
    name: 'nav',
    component: () => import('../views/Nav.vue')
  },
  {
    path: '/container',
    name: 'container',
    component: () => import('../views/Container.vue')
  },
  {
    path: '/component',
    name: 'component',
    component: () => import('../views/Component.vue'),
    /* 重定向 直接访问component 会直接跳转到container */
    redirect:'/component/container',
    children: [{
      /* 子路由不加斜杠 */
      path: 'container',
      component: () => import('../views/Container.vue')
    },
    {
      path: 'table',
      component: () => import('../views/Table.vue')
    }
      ,
    {
      path: 'form',
      component: () => import('../views/Form.vue'),
    }]
  },

]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

export default router
